<template>
  <div class="app-container">
    <div class="filter-container">
      <el-button
        class="filter-item"
        v-if="~accessable.indexOf('goods:goodslist_add')"
        size="small"
        type="primary"
        v-waves
        icon="el-icon-plus"
        @click="handleUpdate(null)"
      >添加</el-button>
      <el-button
        class="filter-item"
        v-if="~accessable.indexOf('goods:goodslist_batch_check')"
        size="small"
        type="primary"
        v-waves
        icon="el-icon-plus"
        @click="batchCheck()"
      >批量审核通过</el-button>
      <el-button
        class="filter-item"
        v-if="~accessable.indexOf('goods:goodslist_batch_check_none')"
        size="small"
        type="danger"
        v-waves
        icon="el-icon-plus"
        @click="batchCheckNone()"
      >批量审核拒绝</el-button>
      <el-input
        @keyup.enter.native="handleFilter"
        clearable
        size="small"
        style="width: 200px;"
        class="filter-item"
        placeholder="商品编码"
        v-model="filters['eq$goods.goods_no']"
      ></el-input>
      <el-input
        @keyup.enter.native="handleFilter"
        clearable
        size="small"
        style="width: 200px;"
        class="filter-item"
        placeholder="商品名称"
        v-model="filters['like$goods.title']"
      ></el-input>
      <el-input
        v-if="~accessable.indexOf('goods:goodslist_provider_search')"
        @keyup.enter.native="handleFilter"
        clearable
        size="small"
        style="width: 200px;"
        class="filter-item"
        placeholder="供应商"
        v-model="filters['goods.providerName']"
      ></el-input>
      <el-select size="small" v-model="filters['goods.status']" clearable placeholder="商品状态">
        <el-option
          v-for="(item,index) in goodsStatusData()"
          :key="index"
          :label="item"
          :value="index"
        ></el-option>
      </el-select>
      <category-cascader :clearable="true" v-model="filters['startWith$goods_category.path']"></category-cascader>
      <br />
      <br />
      <el-select v-model="params['payment_type']" clearable placeholder="支付方式" size="small">
        <el-option v-for="(item,index) in paymentTypes" :key="index" :label="item" :value="index"></el-option>
      </el-select>

      <el-select v-model="filters['goods.auditStep']" clearable placeholder="审核状态" size="small">
        <el-option v-for="(item,index) in auditStatus" :key="index" :label="item" :value="index"></el-option>
      </el-select>

      <el-input
        @keyup.enter.native="handleFilter"
        clearable
        size="small"
        style="width: 200px;"
        class="filter-item"
        placeholder="商品标签"
        v-model="filters['goods.tagTitle']"
      ></el-input>

      <el-select v-model="filters['goods.topFlag']" clearable placeholder="置顶商品" size="small">
        <el-option v-for="(item,index) in roofPlacement" :key="index" :label="item" :value="index"></el-option>
      </el-select>

      <el-button
        class="filter-item"
        type="primary"
        size="small"
        v-waves
        icon="el-icon-search"
        @click="handleFilter"
      >搜索</el-button>
      <el-button
        class="filter-item"
        v-if="~accessable.indexOf('goods:goodslist_export')"
        type="primary"
        size="small"
        v-waves
        icon="el-icon-document"
        @click="exportExcelFile"
      >导出</el-button>
      <div
        style="display:inline-block;margin-left:10px;vertical-align:middle;"
        v-if="~accessable.indexOf('goods:goodslist_batch_import')"
      >
        <el-upload
          class="upload-demo"
          action="/admin/goods/import"
          :on-success="onImportSuccess"
          :limit="1"
          :show-file-list="false"
        >
          <el-button size="small" type="primary">导入商品</el-button>
        </el-upload>
      </div>
      <el-button size="small" type="primary" @click="downloadFile()">商品批量导入模板下载</el-button>
    </div>
    <el-table
      size="smamedium"
      @selection-change="handleSelectionChange"
      :data="list"
      :height="tableHeight"
      :fit="true"
      @sort-change="sortChange"
      v-loading="listLoading"
      element-loading-text="给我一点时间"
      border
      highlight-current-row
      style="width: 100%"
    >
      <el-table-column type="selection" align="center" width="55"></el-table-column>
      <el-table-column align="center" label="操作" width="260" fixed="left">
        <template slot-scope="scope">
          <div class="btns">
            <el-button
              type="primary"
              v-if="~accessable.indexOf('goods:goodslist_modify')"
              size="mini"
              @click="handleUpdate(scope.row)"
            >修改</el-button>
            <!-- <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button> -->
            <template v-if="isAdmin()">
              <el-button
                size="mini"
                v-if="scope.row.auditStep!=2 && ~accessable.indexOf('goods:goodslist_check_approve')"
                type="default"
                @click="handleCommand(scope.row,'authPassed')"
              >审核通过</el-button>
              <el-button
                size="mini"
                v-if="scope.row.auditStep!=9 && ~accessable.indexOf('goods:goodslist_check_reject')"
                type="success"
                @click="handleCommand(scope.row,'unAuthPassed')"
              >审核拒绝</el-button>
            </template>
            <el-button
              size="mini"
              v-if="~accessable.indexOf('goods:goodslist_move_recycled')"
              type="danger"
              @click="move2recycled(scope.row)"
            >移动到回收站</el-button>
            <el-button
              size="mini"
              v-if="~accessable.indexOf('goods:goodslist_stock_modify')"
              type="default"
              @click="changeStock(scope.row)"
            >修改库存</el-button>
            <!-- <el-button size="mini" v-if="scope.row.topFlag==0" type="default" @click="topSettings(scope.row)">置顶123</el-button> -->
            <el-button
              size="mini"
              v-if="scope.row.topFlag==0"
              type="default"
              @click="showTopSettings(scope.row)"
            >置顶</el-button>
            <el-button
              size="mini"
              v-if="scope.row.topFlag==1"
              type="danger"
              @click="cancelTopSettings(scope.row)"
            >取消置顶</el-button>
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="stock" align="center" label="库存" sortable fixed="left">
        <template slot-scope="scope">
          <span>{{scope.row.stock}}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" type="index" label="ID" width="80" fixed="left">
        <template slot-scope="scope">
          <span>{{scope.row.id}}</span>
        </template>
      </el-table-column>
      <el-table-column prop="cover" align="center" label="封面" width="200" fixed="left">
        <template slot-scope="scope">
          <img :src="scope.row.cover|absUrl" alt class="avatar" />
        </template>
      </el-table-column>

      <el-table-column prop="title" align="center" label="商品名称" width="160" fixed="left">
        <template slot-scope="scope">
          <el-tag size="mini" type="danger" v-if="scope.row.tjTag">{{scope.row.tjTag}}</el-tag>
          <div>{{scope.row.title}}</div>
        </template>
      </el-table-column>

      <el-table-column prop="goodsNo" align="center" label="商品编码">
        <template slot-scope="scope">
          <span>{{scope.row.goodsNo}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="barCode" align="center" label="条形码" width="160">
        <template slot-scope="scope">
          <span>{{scope.row.barCode}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="providerName" align="center" label="供应商">
        <template slot-scope="scope">
          <span>{{scope.row.providerName||'中油BP'}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="goodsCategoryName" align="center" label="类别名称">
        <template slot-scope="scope">
          <span>{{scope.row.goodsCategoryName}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="marketPrice" align="center" label="市场价(元)">
        <template slot-scope="scope">
          <span>{{scope.row.marketPrice}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="price" align="center" label="微信价(元)">
        <template slot-scope="scope">
          <span>{{scope.row.price}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="points" align="center" label="积分数(个)">
        <template slot-scope="scope">
          <span>{{scope.row.points}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="brandId" align="center" label="品牌">
        <template slot-scope="scope">
          <span>{{scope.row.brandName}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="tagTitle" align="center" label="标签标题">
        <template slot-scope="scope">
          <span>{{scope.row.tagTitle}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="status" align="center" label="商品状态">
        <template slot-scope="scope">
          <el-tag :type="scope.row.status|tagStatus">{{scope.row.status|goodsStatus}}</el-tag>
        </template>
      </el-table-column>

      <el-table-column prop="status" align="center" label="审核状态" width="120">
        <template slot-scope="scope">
          <el-tag :type="scope.row.auditStep|tagStatus">{{scope.row.auditStep|authStatusFilter}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="status" align="center" label="审核理由" width="120">
        <template slot-scope="scope">{{scope.row.approveRemark}}</template>
      </el-table-column>

      <el-table-column prop="preSaleNum" align="center" label="昨日销量">
        <template slot-scope="scope">
          <span>{{scope.row.preSaleNum}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="saleCount" align="center" label="总销量">
        <template slot-scope="scope">
          <span>{{scope.row.saleCount}}</span>
        </template>
      </el-table-column>

      <el-table-column prop="sort" align="center" label="排序" sortable v-if="isAdmin()">
        <template slot-scope="scope">
          <span>{{scope.row.sort}}</span>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="params.page"
        :page-sizes="[10,20,30,50]"
        :page-size="params.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>

    <el-dialog title="修改库存" :visible.sync="stockDialogVisible" width="600px">
      <el-form
        class="dialog-form"
        ref="stockDialogRulesForm"
        :rules="stockDialogRules"
        :model="stockDialogData"
        label-position="left"
        label-width="120px"
      >
        <table>
          <tr v-for="item in skuStockList" :key="item.skuId">
            <td style="padding-right:15px;">{{item.saleProps|saleProps}}</td>
            <td>
              新增：
              <el-input-number v-model="item.incStock" :min="-item.stock" placeholder="库存数量"></el-input-number>&nbsp;
              <span style>(当前库存：{{item.stock}})</span>
            </td>
          </tr>
        </table>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="stockDialogVisible = false">取消</el-button>
        <el-button type="primary" :loading="submiting" @click="submitChangeStockAction">确定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="设置标签" :visible.sync="dialogFormVisible1" width="800px">
      <el-form
        class="dialog-form"
        :rules="rules"
        ref="dataForm"
        :model="topTemp"
        label-position="left"
        label-width="120px"
      >
        <el-col :span="24">
          <el-form-item label="是否设置标签" prop="tagFlag">
            <el-radio-group v-model="topTemp.tagFlag">
              <el-radio
                v-for="(item,value) in limitLabelFlagItems"
                :key="value"
                :label="value"
                :value="value"
              >{{item}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>

        <div v-if="topTemp.tagFlag">
          <el-col :span="12">
            <el-form-item label="标签名称" label-width="80px" prop="tagTitle">
              <el-input v-model="topTemp.tagTitle" placeholder="标签名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12" class="tagColor">
            <el-form-item label="标签颜色" prop="tagColor">
              <div class="block">
                <el-color-picker v-model="topTemp.tagColor"></el-color-picker>
              </div>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="标签样式" label-width="80px" prop="tagStyle">
              <el-select v-model="topTemp.tagStyle" placeholder="请选择">
                <el-option
                  v-for="item in labelStyle"
                  :key="item.value"
                  :label="item.label"
                  :value="item.label"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="12" v-if="topTemp.tagStyle == 'HOT'">
            <span class="labelText">建议输入两个字</span>
            <img src="../../assets/labelIcon/hot.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '晒图返现'">
            <span class="labelText">建议输入格式“晒图返现10”</span>
            <img src="../../assets/labelIcon/return.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '热销'">
            <span class="labelText">建议输入四个字</span>
            <img src="../../assets/labelIcon/sellwell.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '金卡九折'">
            <span class="labelText">图片无需输入文字</span>
            <img src="../../assets/labelIcon/goldencard.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '新品'">
            <span class="labelText">建议输入两个字</span>
            <img src="../../assets/labelIcon/newProducts.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '秒杀'">
            <span class="labelText">建议输入九个字</span>
            <img src="../../assets/labelIcon/Spike.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '新品上市'">
            <span class="labelText">建议输入四个字</span>
            <img src="../../assets/labelIcon/newProductslist.png" alt width="50px" />
          </el-col>
          <el-col :span="12" v-if="topTemp.tagStyle == '浦发专享'">
            <span class="labelText">建议输入四个字</span>
            <img src="../../assets/labelIcon/pufa.png" alt width="50px" />
          </el-col>
        </div>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible1 = false">取消</el-button>
        <el-button type="primary" :loading="submiting" @click="topSettings()">确定</el-button>
      </div>
    </el-dialog>

    <el-dialog :title="isEditing?'修改':'添加'" :visible.sync="dialogFormVisible" width="1400px">
      <el-form
        class="dialog-form"
        :rules="rules"
        ref="dataForm"
        :model="temp"
        label-position="left"
        label-width="120px"
      >
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="所属分类" prop="categoryPath">
              <category-cascader placeholder="所属分类" v-model="temp.categoryPath"></category-cascader>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="所属品牌" prop="brandId">
              <xd-select filterable v-model="temp.brandId" clearable url="goods_brand"></xd-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="商品标签" prop="tagId">
              <xd-select filterable v-model="temp.tagId" clearable url="goods_tag"></xd-select>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
            <el-form-item label="所属小类" prop="typeCode">
              <el-select v-model="temp.typeCode" filterable placeholder="请选择" @change="changeTypeCode">
                <el-option v-for="item in typeCodeData" :key="item.typeCode" :label="item.title" :value="item.typeCode">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>-->
        </el-row>

        <!-- <el-form-item :label-width="1" prop="goodsRule">

        </el-form-item>-->

        <div style="padding-bottom:30px;">
          <goods-rule
            ref="goodsRule"
            @hasNewGoodRules="hasNewGoodRules=true"
            @hasNoNewGoodRules="hasNewGoodRules=false"
          ></goods-rule>
        </div>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="销售状态" prop="status">
              <el-radio-group v-model="temp.status">
                <el-radio
                  :label="index"
                  v-for="(item,index) in goodsStatusData()"
                  :key="index"
                >{{item}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <!-- <el-col :span="12">
            <el-form-item label="是否置顶" prop="isHot" >
              <el-radio-group v-model="temp.isHot">
                <el-radio :label="index" v-for="(item,index) in yesOrNoData" :key="index">{{item}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>-->
          <el-col :span="12" v-if="isAdmin()">
            <el-form-item label="排序" prop="sort">
              <el-input-number v-model="temp.sort" placeholder="排序"></el-input-number>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="税率" prop="taxrate">
              <el-input-number v-model="temp.taxrate" placeholder="税率"></el-input-number>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="商品详情" prop="content">
          <div class="quill-wrap" style="height:500px;">
            <quill-editor
              style="height:400px;"
              v-model="temp.content"
              ref="myQuillEditor"
              :options="editorOption"
            ></quill-editor>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取消</el-button>
        <el-button type="primary" :loading="submiting" @click="submitFormAction">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';

import categoryCascaderVue from '../../components/categoryCascader.vue';

import {
  paymentTypes,
  auditStatus,
  yesOrNoData,
  roofPlacement,
  labeledGoods
} from '../../config/constants';

import { quillEditor, Quill } from 'vue-quill-editor';
import { container, ImageExtend, QuillWatch } from 'quill-image-extend-module';
import xdUploadVue from '../../components/xdUpload.vue';
import goodsRuleVue from '../../components/goodsRule.vue';
let limitLabelFlagItems = ['否', '是']
Quill.register('modules/ImageExtend', ImageExtend)
export default {
  components: {
    'category-cascader': categoryCascaderVue,
    quillEditor,
    'goods-rule': goodsRuleVue,
    'xd-upload': xdUploadVue
  },
  data () {
    return {
      topTemp: {
        id: '',
        tagFlag: '',
        tagColor: '',
        tagTitle: '',
        tagStyle: ''
      },
      labelStyle: [
        {
          value: 1,
          label: 'HOT'
        },
        {
          value: 2,
          label: '晒图返现'
        },
        {
          value: 3,
          label: '热销'
        },
        {
          value: 4,
          label: '金卡九折'
        },
        {
          value: 5,
          label: '新品'
        },
        {
          value: 6,
          label: '秒杀'
        },
        {
          value: 7,
          label: '新品上市'
        },
        {
          value: 8,
          label: '浦发专享'
        }
      ],
      dialogFormVisible1: null,
      topSetting: 0,
      limitLabelFlagItems,

      roofPlacement,
      labeledGoods,
      auditStatus: auditStatus,
      tableHeight: 500,
      yesOrNoData,
      // typeCodeData:[],
      total: 0,
      hasNewGoodRules: false,
      uillUpdateImg: false,
      paymentTypes: paymentTypes,
      isAddingRule: false,
      skuStockList: [],
      // tagFlag:0,
      stockDialogVisible: false,
      stockDialogData: {
        stock: 0,
        id: 0
      },
      stockDialogRules: {
        stock: [
          {
            required: true,
            message: '商品库存不能为空',
            trigger: 'change'
          }
        ]
      },
      goodsTagItems: [],
      editorOption: {
        placeholder: '在这里输入内容!',
        modules: {
          ImageExtend: {
            loading: true,
            name: 'file',
            action: '/util/upload',
            response: res => {
              return (
                'http://weixin-ostorage01.oss-cn-shenzhen.aliyuncs.com' +
                res.info
              )
            }
          },
          toolbar: {
            container: container,
            handlers: {
              image: function () {
                QuillWatch.emit(this.quill.id)
              }
            }
          }
        }
      },
      temp: {
        id: '',
        categoryId: '',
        categoryCode: '',
        taxrate: 16,
        status: '',
        categoryPath: '',
        skuList: [],
        sort: 0,
        content: '',
        brandId: '',
        tagId: '',
        tagStyle: '',
        tagTitle: '',
        tagColor: ''
      },
      ruleDialogVisible: false,
      rules: {
        cover: [
          {
            required: true,
            message: '封面不能为空',
            trigger: 'change'
          }
        ],

        taxrate: [
          {
            required: true,
            message: '税率不能为空',
            trigger: 'change'
          }
        ],
        sort: [
          {
            required: true,
            message: '排序不能为空',
            trigger: 'change'
          }
        ],
        categoryPath: [
          {
            required: true,
            message: '所属分类不能为空',
            trigger: 'change'
          }
        ],
        isHot: [
          {
            required: true,
            message: '是否置顶不能为空',
            trigger: 'change'
          }
        ],
        // typeCode: [
        //   {
        //     required: true,
        //     message: "请选择小类",
        //     trigger: "change"
        //   }
        // ],

        imgSrcs: [
          {
            required: true,
            message: '请上传至少一张商品图片',
            trigger: 'change'
          }
        ],

        intro: [
          {
            required: true,
            message: '商品简介不能为空',
            trigger: 'change',
            max: 900
          }
        ],
        tagFlag: [
          {
            required: true,
            message: '请选择是否设置标签',
            trigger: 'change'
          }
        ],
        // tagColor: [
        //   {
        //     required: true,
        //     message: '请选择标签颜色',
        //     trigger: 'change',
        //   }
        // ],
        // tagTitle: [
        //   {
        //     required: true,
        //     message: '请输入标签名称',
        //     trigger: 'change',
        //   }
        // ],
        // tagStyle: [
        //   {
        //     required: true,
        //     message: '请选择标签样式',
        //     trigger: 'change',
        //   }
        // ],

        shopNo: [
          {
            required: true,
            message: '商家编码不能为空',
            trigger: 'change',
            max: 60
          }
        ],
        status: [
          {
            required: true,
            message: '销售状态未指定',
            trigger: 'change'
          }
        ],

        content: [
          {
            required: true,
            message: '商品详情不能为空',
            trigger: 'change'
          }
        ]
      }
    }
  },
  filters: {
    saleProps (props) {
      if (typeof props === 'string') {
        if (props == '{}') {
          return '库存';
        }
        props = JSON.parse(props)
      }
      const rt = []
      Object.keys(props).forEach(el => {
        rt.push(el + ':' + props[el])
      })
      return rt.join(' ')
    }
  },

  created () {
    this.init('goods', 1).loadData()

    // this.combOptions("goods_tag").then(info => {
    //   this.goodsTagItems = info;
    // });
    this.tableHeight = window.innerHeight - 340
    // this.$get('/admin/goods_type/all_data').then(data=>{
    //   this.typeCodeData = data;
    // });
  },
  methods: {
    downloadFile () {
      let url = '/excels/商品批量导入模板.xls';
      this.openWin(url)
    },
    handleSelectionChange (val) {
      this.selectedItems = val
    },
    onImportSuccess (res, file, list) {
      list.length = 0
      if (res.errcode == 1) {
        this.$message.error(res.msg)
        return;
      }
      this.$$notify('导入成功')
    },
    move2recycled (row) {
      this.$$comfirm('确定移动到回收站吗？', () => {
        this.$post('/admin/goods/move_recycled', { goodsId: row.id }).then(
          data => {
            this.$$notify('移动成功')
            this.loadData()
          }
        )
      })
    },
    labelSubmitFormAction () {},

    showTopSettings (row) {
      (this.topTemp = {
        id: row.id,
        tagFlag: '',
        tagColor: '',
        tagTitle: '',
        tagStyle: ''
      }),
      (this.dialogFormVisible1 = true)
    },
    topSettings () {
      this.$post('/admin/goods/top_settings', this.topTemp).then(data => {
        this.topSetting = 1
        this.dialogFormVisible1 = false
        this.$$notify('置顶成功！')
        this.loadData()
      })
    },

    cancelTopSettings (row) {
      this.$$comfirm('确定取消置顶吗？', () => {
        this.$post('/admin/goods/cancel_top_settings', { id: row.id }).then(
          data => {
            this.$$notify('成功取消置顶！')
            this.loadData()
          }
        )
      })
    },
    batchCheck () {
      if (!this.selectedItems || this.selectedItems.length == 0) {
        this.$message.error('请选择至少一条记录')
        return;
      }
      this.$prompt('确定审核通过所选记录吗？', '批量审核通过', {
        confirmButtonText: '确定',
        inputPlaceholder: '备注（可选）',
        cancelButtonText: '取消'
      })
        .then(({ value }) => {
          const goodsId = this.selectedItems.map(el => el.id)
          this.$post('/admin/goods/batch_check', {
            goodsId,
            remark: value,
            status: true
          }).then(data => {
            this.$$notify('审核通过成功')
            this.loadData()
          })
        })
        .catch(_ => {
          console.log(_)
        })
    },
    parseContentImgUrl (content) {
      let domain = 'http://weixin-ostorage01.oss-cn-shenzhen.aliyuncs.com';
      content = content.replace(/<img[\s\S]+?src="([^"]+)"/gi, function (m, m1) {
        if (m1 && m1[0] !== '/') {
          m1 = '/' + m1
        }
        let rt = m.replace(m1, domain + m1)
        return rt
      })
      return content
    },
    batchCheckNone () {
      if (!this.selectedItems || this.selectedItems.length == 0) {
        this.$message.error('请选择至少一条记录')
        return;
      }
      this.$prompt('确定审核拒绝所选记录吗？', '批量审核拒绝', {
        confirmButtonText: '确定',
        inputPlaceholder: '备注（可选）',
        cancelButtonText: '取消'
      })
        .then(({ value }) => {
          const goodsId = this.selectedItems.map(el => el.id)
          this.$post('/admin/goods/batch_check', {
            goodsId,
            remark: value,
            status: false
          }).then(data => {
            this.$$notify('审核拒绝成功')
            this.loadData()
          })
        })
        .catch(_ => {
          console.log(_)
        })
    },
    // changeTypeCode(param1){
    //   if(this.typeCodeData){
    //     let cc;
    //     (cc = this.typeCodeData.filter(e=>e.typeCode==param1)[0]) && (this.temp.typeName=cc.title);

    //   }
    // },
    __onHandleUpdate (row) {
      if (row && row.content) {
        row.content = this.parseContentImgUrl(row.content)
      }
      setTimeout(_ => {
        this.$refs['goodsRule'].initData(row ? row.skuList : [])
      }, 0)
    },
    changeStock (row) {
      this.stockDialogData = row
      if (row.skuList && row.skuList.length) {
        this.skuStockList = row.skuList.map(el => {
          return {
            stock: el.stock,
            saleProps: el.saleProps,
            incStock: 0,
            skuId: el.id
          }
        })
      }
      // this.stockDialogData.stock = row.stock;
      this.stockDialogVisible = true
    },
    submitChangeStockAction () {
      this.$refs['stockDialogRulesForm'].validate(valid => {
        if (valid) {
          if (this.submiting) {
            return
          }
          this.submiting = true
          this.$post('/admin/goods/set_stock', {
            goodsId: this.stockDialogData.id,
            ...this.parseArr2Params(
              'skuStockList',
              this.skuStockList.map(i => {
                return {
                  incStock: i.incStock,
                  skuId: i.skuId
                }
              })
            )
          })
            .then(_ => {
              this.submiting = false
              this.stockDialogVisible = false
              this.$$notify('操作成功')
              this.loadData()
            })
            .catch(_ => {
              this.submiting = false
            })
        }
      })
    },
    submitFormAction () {
      if (this.submiting) {
        return
      }
      this.$refs['dataForm'].validate(valid => {
        if (!valid) {
          return
        }
        this.$refs['goodsRule'].valid().then(() => {
          let skuList = this.$refs['goodsRule'].getData()
          skuList = this.parseArr2Params('skuList', skuList)
          this.submiting = true
          let data = {
            ...this.temp,
            ...skuList
          }
          let t = data.categoryPath.replace(/^,|,$/g, '').split(',')
          data.categoryId = t[t.length - 1]
          if (data.skuList) {
            delete data.skuList
          }
          let url = '/admin/goods/add_goods';
          if (this.temp.id > 0) {
            url = '/admin/goods/modify_goods';
            data.goodsId = data.id
            delete data.id
          }
          this.$post(url, data)
            .then(_ => {
              this.dialogFormVisible = false
              this.$$notify('操作成功')
              this.loadData()
              this.submiting = false
            })
            .catch(_ => {
              this.submiting = false
            })
        })
      })
    },
    __onParseFilterValue (field, eq, value) {
      if (value) {
        if (field == 'goods_category.path') {
          return ',' + value.replace(/^,|,$/g, '') + ',';
        }
      }
      return value
    },
    handleCommand (row, command) {
      let postData = (value, isPassed) => {
        this.$post('/admin/goods/' + command, {
          id: row.id,
          approveRemark: value
        }).then(res => {
          if (isPassed) {
            row.auditStep = 2
          } else {
            row.auditStep = 9
          }
          this.$$notify('操作成功')
        })
      };
      if (command == 'unAuthPassed') {
        this.$prompt('请输入审核拒绝理由', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消'
        })
          .then(({ value }) => {
            postData(value)
          })
          .catch(() => {})
      } else {
        this.$$comfirm('确定审核通过吗？', () => {
          postData('', 1)
        })
      }
    },

    exportExcelFile () {
      this.exportExcel({
        title: '商品',
        fields: [
          {
            field: 'goodsNo',
            title: '商品编码'
          },

          {
            field: 'title',
            title: '商品名称'
          },
          {
            field: 'saleProps',
            title: '规格名称'
          },
          {
            field: 'categoryName',
            title: '所属分类'
          },
          {
            field: 'providerName',
            title: '供应商'
          },
          {
            field: 'brandName',
            title: '商品品牌'
          },

          {
            field: 'statusDesc',
            title: '商品状态',
            valueMap: this.goodsStatusData()
          },
          {
            field: 'marketPrice',
            title: '市场价'
          },
          {
            field: 'price',
            title: '微信价'
          },
          {
            field: 'points',
            title: '积分价'
          },
          {
            field: 'stock',
            title: '商品库存'
          },
          {
            field: 'alert_stock',
            title: '警戒库存'
          }
        ]
      }).then(info => {
        this.openWin(info)
      })
    }
  }
}
</script>
<style scoped>
.labelText {
  display: block;
  color: #f56c6c;
  font-size: 14px;
  margin-bottom: 20px;
}
.avatar {
  height: auto;
  display: block;
  margin: 0 auto;
  width: 100px;
}
.tagColor {
  padding-left: 50px;
}
.btns {
  padding-left: 15px;
}

.btns /deep/ button {
  margin-top: 10px;
  margin-bottom: 10px;
}
</style>
